<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>register</title>
<link rel="stylesheet"
    href="../bootstrap/css/bootstrap.css">
<script src="../js/angular.1_4_6.min.js"></script>
<script>
    var app = angular.module('myApp', []);
    app.controller('registerCtrl', function($scope) {

    });
</script>
</head>
<body onload="document.getElementById('email').focus()">
    <div class="col-sm-6 col-sm-offset-3" ng-app="myApp"
        ng-controller="registerCtrl">
        <h1>用户注册</h1>
        <form name="registerForm" novalidate>
            <div id="email-group">
                <label for="email">E-mail:</label> <input type="email"
                    class="form-control" ng-model="email" name="email" id="email"
                    placeholder="请输入电子邮箱..." required>
                <p>
                    <span style="color: red" ng-show=" registerForm.email.$invalid">
                        <span ng-show="registerForm.email.$error.required">*请输入邮箱</span> <span
                        ng-show="registerForm.email.$error.email">*请输入正确的email地址</span>
                    </span>
                </p>
            </div>

            <div id="name-group">
                <label for="name">昵称：</label> <input type="text"
                    class="form-control" ng-model="name" name="name" id="name"
                    placeholder="请输入昵称..." required>
                <p>
                    <span style="color: red" ng-show="registerForm.name.$invalid">
                        <span ng-show="registerForm.name.$error.required">*请输入姓名</span>
                    </span>
                </p>
            </div>

            <div id="password-group">
                <label for="password">密码：</label> <input type="password"
                    class="form-control" ng-model="password" ng-minlength="6"
                    ng-maxlength="20" name="password" id="password"
                    placeholder="请输入密码..." required>
                <p>
                    <span style="color: red" ng-show="registerForm.password.$invalid">
                        <span ng-show="registerForm.password.$error.minlength">*密码长度不小于6</span>
                        <span ng-show="registerForm.password.$error.maxlength">*密码长度不超过20</span>
                    </span>
                </p>
            </div>
            <div id="passwordagaingroup">
                <label for="passwordagain">再输入一遍密码：</label> <input type="password"
                    class="form-control" ng-model="passwordagain" name="passwordagain"
                    id="passwordagain" placeholder="请再输一遍密码..." required>
                <p>
                    <span style="color: red" ng-show="registerForm.password.$valid">
                        <span ng-show="passwordagain!=password">*两次密码输入不一致</span>
                    </span>
                </p>
            </div>

            <button type="submit" class="btn btn-success"
                ng-disabled="registerForm.email.$invalid || registerForm.name.$invalid || registerForm.password.$invalid || password != passwordagain">
                提交<span class="fa fa-arrow-right"></span>
            </button>
        </form>
    </div>


</body>
</html>